"use strict";



// check-item

function isEqual(obj1, obj2) {
    return JSON.stringify(obj1) === JSON.stringify(obj2)
}

var checkerItem = Vue.extend({
    template: `  <div class="vux-checker-item" :class="classNames" @click="select">
    <slot></slot>
  </div>`,
    name: 'checker-item',
    props: {
        value: {
            type: [String, Number, Object],
            required: true
        },
        disabled: Boolean
    },
    watch: {
        disabled(val) {
            if (val && this.$parent.type === 'radio' && this.value === this.$parent.currentValue) {
                this.$parent.currentValue = ''
            }
        }
    },
    computed: {
        classNames() {
            const isSimpleValue = typeof this.value === 'string' || typeof this.value === 'number'
            const names = {
                'vux-tap-active': !this.disabled
            }

            if (this.$parent.defaultItemClass) {
                names[this.$parent.defaultItemClass] = true
            }

            if (this.$parent.selectedItemClass) {
                let selected = false
                if (this.$parent.type === 'radio') {
                    if (isSimpleValue && this.$parent.currentValue === this.value) {
                        selected = true
                    } else if (typeof this.value === 'object' && isEqual(this.$parent.currentValue, this.value)) {
                        selected = true
                    }
                } else {
                    if (typeof this.value === 'string') {
                        if (this.$parent.currentValue.indexOf(this.value) > -1) {
                            selected = true
                        }
                    } else if (this.$parent.currentValue && this.$parent.currentValue.length) {
                        const match = this.$parent.currentValue.filter(one => {
                            return isEqual(one, this.value)
                        })
                        selected = match.length > 0
                    }
                }
                names[this.$parent.selectedItemClass] = selected
            }

            if (this.$parent.disabledItemClass) {
                names[this.$parent.disabledItemClass] = this.disabled
            }

            return names
        }
    },
    methods: {
        select() {
            if (this.$parent.type === 'radio') {
                this.selectRadio()
            } else {
                this.selectCheckbox()
            }
        },
        selectRadio() {
            if (!this.disabled) {
                if (this.$parent.currentValue === this.value) {
                    if (!this.$parent.radioRequired) {
                        this.$parent.currentValue = ''
                    }
                } else {
                    this.$parent.currentValue = this.value
                }
            }
            this.$emit('on-item-click', this.value, this.disabled)
        },
        selectCheckbox() {
            if (!this.$parent.currentValue || this.$parent.currentValue === null) {
                this.$parent.currentValue = []
            }
            const isSimpleValue = typeof this.value === 'string' || typeof this.value === 'number'
            if (!this.disabled) {
                let index = -1
                if (isSimpleValue) {
                    index = this.$parent.currentValue.indexOf(this.value)
                } else {
                    index = this.$parent.currentValue.map(one => JSON.stringify(one)).indexOf(JSON.stringify(this.value))
                }
                if (index > -1) {
                    this.$parent.currentValue.splice(index, 1)
                } else {
                    if (!this.$parent.max || (this.$parent.max && (this.$parent.currentValue !== null && this.$parent.currentValue.length < this.$parent.max))) {
                        if (!this.$parent.currentValue || !this.$parent.currentValue.length) {
                            this.$parent.currentValue = []
                        }
                        this.$parent.currentValue.push(this.value)
                    }
                }
            }
            this.$emit('on-item-click', this.value, this.disabled)
        }
    }
});

Vue.component('checkerItem', checkerItem)


// checker
var checker = Vue.extend({
    template: `<div class="vux-checker-box"><slot></slot></div>`,
    name: 'checker',
    props: {
        defaultItemClass: String,
        selectedItemClass: String,
        disabledItemClass: String,
        type: {
            type: String,
            default: 'radio'
        },
        value: [String, Number, Array, Object],
        max: Number,
        radioRequired: Boolean
    },
    watch: {
        value(newValue) {
            this.currentValue = newValue
        },
        currentValue(val) {
            this.$emit('input', val)
            this.$emit('on-change', val)
        }
    },
    data() {
        return {
            currentValue: this.value
        }
    }
});
Vue.component('checker', checker)



//--divider
var divider = Vue.extend({
    template: `<p class="vux-divider"><slot></slot></p>`,
    name: 'divider'
});
Vue.component('divider', divider)

// alert
var ealert = Vue.extend({
    template: `   
    <div class="ealert-dialog-masklayer" v-if="show" >
        <div style="" class="ealert-dialog">
            <div class="top">
                <div class="title">{{title||'提示'}}</div>
                <div class="content">{{content||'成功发送'}}</div>
            </div>
            <div class="okbtn" v-on:click="btnAction();" >
            {{btnTxt||'确定'}}
            </div>
        </div>
    </div>`,
    name: 'ealert',
    props: {

    },
    watch: {

    },
    data() {
        return {
            show: false,
            title: '提示',
            content: '内容',
            btnTxt: '确定',
            fun: function() {}
        }
    },
    mounted: function() {

    },
    methods: {
        showConfirm: function(title, content, btnTxt, fun) {
            var vm = this
            vm.show = true
            vm.title = title
            vm.content = content
            vm.btnTxt = btnTxt || '确定'
            vm.fun = fun
            console.log(vm.btnTxt)
        },
        btnAction: function() {
            var vm = this
            vm.show = false
            if (vm.fun) {
                vm.fun()
            }
        }
    }
});
Vue.component('ealert', ealert)


// econfirm
var econfirm = Vue.extend({
    template: `   
    <div class="econfirm-dialog-masklayer" v-if="show" >
        <div style="" class="econfirm-dialog">
            <div class="top">
                <div class="title">{{title||'提示'}}</div>
                <div class="content">{{content||'成功发送'}}</div>
            </div>
            <div class="okbtn" v-on:click="btnAction('确定');" >
            {{btnTxt||'确定'}}
            </div>
            <div class="cancelbtn" v-on:click="btnAction('取消');" >
            {{cancelTxt||'取消'}}
            </div>
        </div>
    </div>`,
    name: 'econfirm',
    props: {

    },
    watch: {

    },
    data() {
        return {
            show: false,
            title: '提示',
            content: '内容',
            btnTxt: '确定',
            cancelTxt: '取消',
            fun: function() {},
            fun2: function() {}
        }
    },
    mounted: function() {

    },
    methods: {
        showConfirm: function(title, content, btnTxt, fun, cancelTxt, fun2) {
            var vm = this
            vm.show = true
            vm.title = title
            vm.content = content
            vm.btnTxt = btnTxt || '确定'
            vm.fun = fun
            vm.cancelTxt = cancelTxt || '取消'
            vm.fun2 = fun2
        },
        btnAction: function(name) {
            var vm = this
            vm.show = false
            console.log(name)
            if (name == '确定') {
                if (vm.fun) {
                    vm.fun()
                }
            }
            if (name == '取消') {
                if (vm.fun2) {
                    vm.fun2()
                }
            }

        }
    }
});
Vue.component('econfirm', econfirm)

// einputconfirm
var einputconfirm = Vue.extend({
    template: `   
    <div class="econfirm-dialog-masklayer" v-if="show" >
        <div style="" class="econfirm-dialog">
            <div class="top">
                <div class="title">{{title||'提示'}}</div>
                <input type="" name="" :placeholder="placeholder" class="einputconfirm-input" v-model="newValue">
            </div>
            <div class="okbtn" v-on:click="btnAction('确定');" >
            {{btnTxt||'确定'}}
            </div>
            <div class="cancelbtn" v-on:click="btnAction('取消');" >
            {{cancelTxt||'取消'}}
            </div>
        </div>
    </div>`,
    name: 'einputconfirm',
    props: {

    },
    watch: {

    },
    data() {
        return {
            show: false,
            title: '提示',
            placeholder: '内容',
            btnTxt: '确定',
            cancelTxt: '取消',
            fun: function() {},
            fun2: function() {},
            oldvalue:'',
            newValue:'',
        }
    },
    mounted: function() {

    },
    methods: {
        showConfirm: function(title, placeholder, oldvalue,btnTxt, fun, cancelTxt, fun2) {
            var vm = this
            vm.show = true
            vm.title = title
            vm.placeholder = placeholder
            vm.oldvalue = oldvalue
            vm.newValue = oldvalue
            vm.btnTxt = btnTxt || '确定'
            vm.fun = fun
            vm.cancelTxt = cancelTxt || '取消'
            vm.fun2 = fun2
        },
        btnAction: function(name) {
            var vm = this
            vm.show = false
            // console.log(name)
            if (name == '确定') {
                if (vm.fun) {
                    vm.fun(vm.newValue,vm.oldvalue)
                }
            }
            if (name == '取消') {
                if (vm.fun2) {
                    vm.fun2()
                }
            }
        }
    }
});
Vue.component('einputconfirm', einputconfirm)




var XNumber = Vue.extend({
    template: '<div class="weui-cells alone">\n' +
        '  <div class="weui-cell">\n' +
        '    <div class="weui-cell__bd">\n' +
        '      <p>{{ title }}</p>\n' +
        '    </div>\n' +
        '<div class="weui_cell_ft clearfix" v-show="!readonly">\n' +
        '<a @click="sub" class="number-selector number-selector-sub" :class="{\'number-disabled\':disabledMin}">-</a>\n' +
        '<span class="number-input" :style="{width: width+\'px\'}" style="display: inline-block">{{ currentValue }}</span>\n' +
        '<input v-model.number="currentValue" type="hidden" pattern="[0-9]*"/>\n' +
        '<a @click="add" class="number-selector number-selector-plus" :class="{\'number-disabled\':disabledMax}">+</a>\n' +
        '</div>\n' +
        '  </div>\n' +
        '</div>',
    props: {
        min: Number,
        max: Number,
        name: String,
        step: {
            type: Number,
            default: 1
        },
        value: {
            default: 1
        },
        title: String,
        readonly: Boolean,
        fillable: {
            type: Boolean,
            default: true
        },
        width: {
            type: Number,
            default: 50
        }
    },
    data: function() {
        return {
            currentValue: 0
        }
    },
    created: function() {
        this.currentValue = Number(this.value)
    },
    computed: {
        disabledMin: function() {
            return typeof this.min === 'undefined' ? false : this.currentValue <= this.min
        },
        disabledMax: function() {
            return typeof this.max === 'undefined' ? false : this.currentValue >= this.max
        }
    },
    watch: {
        currentValue: function(newValue, old) {
            if (this.min && this.value < this.min) {
                this.currentValue = this.min
            }
            if (this.max && this.value > this.max) {
                this.currentValue = this.max
            }
            this.$emit('input', this.currentValue);
            this.$emit('on-change', this.currentValue)
        },
        value: function(value) {
            this.currentValue = Number(value)
        }
    },
    methods: {
        add: function() {
            if (!this.disabledMax) {
                this.currentValue += this.step
            } else {
                this.$emit('input', this.max);
            }
        },
        sub: function() {
            if (!this.disabledMin) {
                this.currentValue -= this.step
            } else {
                this.$emit('input', this.min);
            }
        }
    }
});
Vue.component('XNumber', XNumber)


var needknow = Vue.extend({
    template: "<div v-if='showNeedknow' class='need-know-masklayer' v-on:click='close()'>  \
    <div class='need-know-white' v-on:click.stop=''>  \
                <div class=\"need-know-scroll\"> \
                    <div v-html=\"showHTML(content)\" style=\"padding:0.2rem;font-size:0.4rem;\"></div> \
                </div> \
                <div class=\"need-know-submit\" v-on:click=\"close()\">确定</div> \
            </div> \
        </div> ",
    name: 'needknow',
    props: {
        showNeedknow: Boolean,
        content: String,
        title: String,
    },
    data: function() {
        return {
            a: "1"
        }
    },
    created: function() {

    },
    computed: {

    },
    watch: {
        showNeedknow: function(newValue, old) {
            console.log("watch", newValue)
        },
        value: function(value) {
            this.currentValue = Number(value)
        }
    },
    methods: {
        close: function() {
            this.$emit('on-close')
        },
        showHTML: function(val) {
            if (!val) return '暂无详情'
            return val
                .replace(val ? /&(?!#?\w+;)/g : /&/g, '&amp;')
                .replace(/&lt;/g, "<")
                .replace(/&gt;/g, ">")
                .replace(/&quot;/g, "\"")
                .replace(/&#39;/g, "\'")
                .replace(/src=/g, "data-src=");
        },
    }
});
Vue.component('needknow', needknow)

var invoice = Vue.extend({
    template: "<div v-if='showInvoice' class='invoice-masklayer' v-on:click='close()'> \
            <div v-if=\"needHead\" class=\"head-top\"> \
                <a class=\"aback\" v-on:click=\"close()\"><div class=\"back\"></div></a> \
                <div class=\"title\">填写发票</div> \
            </div> \
            <div class=\"invoice-white\" v-on:click.stop=\"\"> \
                <div class=\"invoice-scroll\"> \
                    <div class=\"invoice-cellui-item-noborder\" style=\" \"> \
                        <div class=\"title\">是否需要开票</div> \
                    </div> \
                    <div class=\"invoice-cellui-item\" style=\" \"> \
                        <div class=\"invoice-r1 invoice-r-selected\" >需要发票</div> <div class=\"invoice-r2 invoice-r-unselected\" v-on:click='close()'>暂不需要</div> \
                    </div> \
                    <div style=\"position:relative;height:10px;background:#e8e6e6;\"></div> \
                    <div class=\"invoice-cellui-item-noborder\" style=\" \"> \
                        <div class=\"title\">发票抬头</div> \
                    </div> \
                    <div class=\"invoice-cellui-item\" style=\" \"> \
                        <div class=\"invoice-sel-item\" v-on:click='v_is_company = 1'><div class=\"iconfont invoice-selected\" v-if=\"v_is_company==1\">&#xe649</div><div class=\"iconfont invoice-unselected\" v-if=\"v_is_company==2\">&#xe616</div><div class=\"invoice-sel-txt\">个人</div></div> \
                        <div class=\"invoice-sel-item\" v-on:click='v_is_company = 2'><div class=\"iconfont invoice-selected\" v-if=\"v_is_company==2\">&#xe649</div><div class=\"iconfont invoice-unselected\" v-if=\"v_is_company==1\">&#xe616</div><div class=\"invoice-sel-txt\">单位</div></div> \
                    </div> \
                    <div class=\"invoice-cellui-item\" style=\" \"> \
                        <div class=\"title\">发票信息</div> \
                        <div class=\"invoice-right-value2\" style=\"color:#000;\">旅游服务-服务费</div> \
                    </div> \
                    <div class=\"invoice-cellui-item\" style=\" \"> \
                        <div class=\"title\">发票抬头</div> \
                        <input type=\"\" name=\"\" placeholder=\"请填写发票抬头\" class=\"invoice-input\" v-model=\"v_buyername\"> \
                    </div> \
                    <div class=\"invoice-cellui-item\" style=\" \"> \
                        <div class=\"title\">联系电话</div> \
                        <input type=\"\" name=\"\" placeholder=\"请填写联系电话\" class=\"invoice-input\" v-model=\"v_phone\"> \
                    </div> \
                    <div class=\"invoice-cellui-item\" style=\" \" v-if=\"v_is_company==2\"> \
                        <div class=\"title\">发票税号</div> \
                        <input type=\"\" name=\"\" placeholder=\"请填写发票税号\" class=\"invoice-input\" v-model=\"v_taxnum\"> \
                    </div> \
                    <div class=\"invoice-cellui-item\" style=\" \" v-if=\"v_is_company==2\"> \
                        <div class=\"title\">银行账户</div> \
                        <input type=\"\" name=\"\" placeholder=\"请填写银行账户\" class=\"invoice-input\" v-model=\"v_account\"> \
                    </div> \
                    <div class=\"invoice-cellui-item\" style=\" \" v-if=\"v_is_company==2\"> \
                        <div class=\"title\">公司地址</div> \
                        <input type=\"\" name=\"\" placeholder=\"请填写公司地址\" class=\"invoice-input\" v-model=\"v_address\"> \
                    </div> \
                    <div style=\"position:relative;height:1.2rem;background:#e8e6e6;\"></div> \
                </div> \
                <div class=\"need-know-submit\" v-on:click=\"save()\">保存</div> \
            </div> \
        </div> \
    ",
    name: 'invoice',
    props: [
        'showInvoice',
        'content',
        'needHead',
        'invoice',
        'is_company',
        'buyername',
        'phone',
        'taxnum',
        'account',
        'address'
    ],
    mounted: function() {
        var vm = this
        vm.v_invoice = vm.invoice || 2 //1开票 2不开票默认不开票
        vm.v_is_company = vm.is_company || 1 // 发票类型 1个人 2单位
        vm.v_buyername = vm.buyername || ''
        vm.v_phone = vm.phone || ''
        vm.v_taxnum = vm.taxnum || ''
        vm.v_account = vm.account || ''
        vm.v_address = vm.address || ''
    },
    // props: {


    //     showInvoice: Boolean,
    //     content: String,
    //     needHead: Boolean,
    //     invoice:

    // },
    data: function() {
        return {
            v_invoice: 2, //1开票 2不开票默认不开票
            v_is_company: 1, // 发票类型 1个人 2单位
            v_buyername: '', //发票抬头
            v_phone: '', // phone
            v_taxnum: '', // 发票税号
            v_account: '', // 银行账户
            v_address: '', // 公司地址
        }
    },
    created: function() {

    },
    computed: {

    },
    watch: {
        showNeedknow: function(newValue, old) {
            console.log("watch", newValue)
        },
        value: function(value) {
            this.currentValue = Number(value)
        }
    },
    methods: {
        close: function() {
            this.$emit('on-close')
        },
        save: function() {
            var vm = this
            var data = {}
            data.v_invoice = 1
            data.v_is_company = vm.v_is_company
            data.v_buyername = vm.v_buyername
            data.v_phone = vm.v_phone
            data.v_taxnum = vm.v_taxnum
            data.v_account = vm.v_account
            data.v_address = vm.v_address
            this.$emit('on-save', data)
        },
        showHTML: function(val) {
            if (!val) return '暂无详情'
            return val
                .replace(val ? /&(?!#?\w+;)/g : /&/g, '&amp;')
                .replace(/&lt;/g, "<")
                .replace(/&gt;/g, ">")
                .replace(/&quot;/g, "\"")
                .replace(/&#39;/g, "\'")
                .replace(/src=/g, "data-src=");
        },
    }
});
Vue.component('invoice', invoice)
